<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="Cache-Control" content="no-cache, must-revalidate">
    <meta http-equiv="expires" content="0">
    <title>Share</title>
    <link rel="stylesheet" href="../../static/css/bootstrap.min.css" th:href="@{/static/css/bootstrap.min.css}">
    <link rel="stylesheet" href="../../static/css/fileinput.css" th:href="@{/static/css/fileinput.css}">
    <!-- Bootstrap 核心CSS -->
    <link rel="stylesheet" href="../../static/css/font-awesome.min.css" th:href="@{/static/css/font-awesome.min.css}">

    <!-- Meta关键字定义 -->
    <meta name="description" content="The most popular HTML, CSS, and JS library in the world.">
    <meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
    <style>
        body {font-size: .875rem;}
        .feather {width: 16px;height: 16px;vertical-align: text-bottom;}
        .sidebar {position: fixed;top: 0;bottom: 0;left: 0;z-index: 100;padding: 0;box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);}
        .sidebar-sticky {position: -webkit-sticky;position: sticky;top: 48px; height: calc(100vh - 48px);padding-top: .5rem;overflow-x: hidden;overflow-y: auto; }
        .sidebar .nav-link {font-weight: 500;color: #333;}
        .sidebar .nav-link .feather {margin-right: 4px;color: #999;}
        .sidebar .nav-link.active {color: #007bff;}
        .sidebar .nav-link:hover .feather,.sidebar .nav-link.active .feather {color: inherit;}
        .sidebar-heading {font-size: .75rem;text-transform: uppercase;}
        .navbar-brand {padding-top: .75rem;padding-bottom: .75rem;font-size: 1rem;background-color: rgba(0, 0, 0, .25);box-shadow: inset -1px 0 0 rgba(0, 0, 0, .25);}
        .navbar .form-control {padding: .75rem 1rem;border-width: 0;border-radius: 0;}
        .form-control-dark {color: #fff;background-color: rgba(255, 255, 255, .1);border-color: rgba(255, 255, 255, .1);}
        .form-control-dark:focus {border-color: transparent;box-shadow: 0 0 0 3px rgba(255, 255, 255, .25);}
        .border-top { border-top: 1px solid #e5e5e5; }
        .border-bottom { border-bottom: 1px solid #e5e5e5; }
    </style>
</head>
<body>
<nav class="navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0">
    <a class="navbar-brand col-sm-3 col-md-2 mr-0" href="#">Company name</a>
    <input class="form-control form-control-dark w-100" type="text" placeholder="Search" aria-label="Search">
    <ul class="navbar-nav px-3">
        <li class="nav-item text-nowrap">
            <a class="nav-link" href="#">Sign out</a>
        </li>
    </ul>
</nav>
<div class="container-fluid">
    <div class="row">
        <nav class="col-md-2 d-none d-md-block bg-light sidebar">
            <div class="sidebar-sticky">
                <ul class="nav flex-column">
                    <li class="nav-item">
                        <a class="nav-link" href="/dashboard">
                            <span data-feather="home"></span>
                            Dashboard <span class="sr-only">(current)</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">
                            <span data-feather="file"></span>
                            Orders
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link active" href="/goods">
                            <span data-feather="shopping-cart"></span>
                            Goods
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">
                            <span data-feather="users"></span>
                            Customers
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">
                            <span data-feather="bar-chart-2"></span>
                            Reports
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">
                            <span data-feather="layers"></span>
                            Integrations
                        </a>
                    </li>
                </ul>

                <h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted">
                    <span>Saved reports</span>
                    <a class="d-flex align-items-center text-muted" href="#">
                        <span data-feather="plus-circle"></span>
                    </a>
                </h6>
                <ul class="nav flex-column mb-2">
                    <li class="nav-item">
                        <a class="nav-link" href="#">
                            <span data-feather="file-text"></span>
                            Current month
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">
                            <span data-feather="file-text"></span>
                            Last quarter
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">
                            <span data-feather="file-text"></span>
                            Social engagement
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">
                            <span data-feather="file-text"></span>
                            Year-end sale
                        </a>
                    </li>
                </ul>
            </div>
        </nav>

        <main role="main" class="col-md-9 ml-sm-auto col-lg-10 pt-3 px-4">
            <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pb-2 mb-3 border-bottom">
                <h1 class="h2">Dashboard</h1>
                <div class="btn-toolbar mb-2 mb-md-0">
                    <div class="btn-group mr-2">
                        <button class="btn btn-sm btn-outline-secondary">Share</button>
                        <button class="btn btn-sm btn-outline-secondary">Export</button>
                    </div>
                    <button class="btn btn-sm btn-outline-secondary dropdown-toggle">
                        <span data-feather="calendar"></span>
                        This week
                    </button>
                </div>
            </div>
            <div class="custom-file ">
                <!--th:action="@{'/ShareUpload/'+${session.user.getUID()}}"-->
                <form id="uploadForm"  action="/upload/uploadGoods" method="post" enctype="multipart/form-data">
                    <input type="hidden" name="_method" value="put" th:if="${good!=null}"/>
                    <input type="hidden" name="path" value="/goods"/>
                    <input type="hidden" name="id" th:if="${good!=null}" th:value="${good.id}">
                    <div class="row form-group">
                        <label>name</label>
                        <input name="name" type="text" class="form-control" placeholder="space" th:value="${good!=null}?${good.name}">
                    </div>
                    <div class="row form-group">
                        <label>buying_price</label>
                        <input name="buying_price" class="form-control" placeholder="0.00" th:value="${good!=null}?${good.buying_price}">
                    </div>
                    <div class="row form-group">
                        <label>selling_price</label>
                        <input name="buying_price" class="form-control" placeholder="0.00" th:value="${good!=null}?${good.selling_price}">
                    </div>
                    <div class="row form-group">
                        <label>place</label>
                        <input name="buying_price" class="form-control"th:value="${good!=null}?${good.place}">
                    </div>
                    <div class="row form-group">
                        <label>state</label><br/>
                        <div class="form-check form-check-inline">
                            <input class="form-check-input" type="radio" name="gender" value="1" th:checked="${good!=null}?${good.state==1}">
                            <label class="form-check-label">上架</label>
                        </div>
                        <div class="form-check form-check-inline">
                            <input class="form-check-input" type="radio" name="gender" value="0" th:checked="${good!=null}?${good.state==0}">
                            <label class="form-check-label">下架</label>
                        </div>
                    </div>
                    <div class="row form-group">
                        <label>time</label>
                        <input name="times" class="form-control"th:value="${good!=null}?${good.times}">
                    </div>
                    <div class="row form-group">
                        <label>type</label>
                        <!--<select class="form-control" name="department.id">-->
                        <!--<option th:selected="${good!=null}?${dept.id == good.id}" th:value="${dept.id}" th:each="dept:${good}" th:text="${dept.departmentName}">1</option>-->
                        <!--</select>-->
                    </div>
                    <div class="row form-group">
                        <label class="col-md-4">图片上传:</label>
                        <div class="col-sm-12">
                            <input id="input-id" name="file" multiple="multiple" type="file" data-show-caption="true"/>
                        </div>
                    </div>
                    <div>
                        <button id="submit" type="submit" class="btn btn-primary" style="width: 100%;">上传</button>
                    </div>
                </form>
            </div>
        </main>
    </div>
</div>







    <!-- Bootstrap 核心 JavaScript -->
    <script type="text/javascript" src="../../static/js/jquery-3.3.1.js" th:src="@{../../static/js/jquery-3.3.1.js}"></script>
    <script type="text/javascript" src="../../static/js/popper.min.js" th:src="@{../../static/js/popper.min.js}"></script>
    <script type="text/javascript" src="../../static/js/bootstrap.min.js" th:src="@{../../static/js/bootstrap.min.js}"></script>
    <script type="text/javascript" src="../../static/js/Chart.min.js" th:src="@{../../static/js/Chart.min.js}"></script>
    <script type="text/javascript" src="../../static/js/piexif.js" th:src="@{../../static/js/piexif.js}"></script>
    <script type="text/javascript" src="../../static/js/fileinput.js" th:src="@{../../static/js/fileinput.js}"></script>
    <script type="text/javascript" src="../../static/js/zh.js" th:src="@{../../static/js/zh.js}"></script>
    <script type="text/javascript" src="../../static/js/bootstrap.bundle.min.js" th:src="@{../../static/js/bootstrap.bundle.min.js}"></script>
    <!-- Icons -->
    <script type="text/javascript" src="../../static/js/feather.min.js" th:src="@{../../static/js/feather.min.js}"></script>
    <script type="text/javascript">
        $(function () {
            initFileInput("input-id");
        })

        function initFileInput(ctrlName) {
            var control = $('#' + ctrlName);
            control.fileinput({
                language: 'zh', //设置语言
                uploadUrl: "/ImageUpload", //上传的地址
                allowedFileExtensions: ['jpg', 'gif', 'png'],//接收的文件后缀
                //uploadExtraData:{"id": 1, "fileName":'123.mp3'},
                uploadAsync: true, //默认异步上传
                showUpload: false, //是否显示上传按钮
                showRemove : true, //显示移除按钮
                showPreview : true, //是否显示预览
                showCaption: false,//是否显示标题
                browseClass: "btn btn-primary", //按钮样式
                //dropZoneEnabled: true,//是否显示拖拽区域
                //minImageWidth: 50, //图片的最小宽度
                //minImageHeight: 50,//图片的最小高度
                //maxImageWidth: 1000,//图片的最大宽度
                //maxImageHeight: 1000,//图片的最大高度
                //maxFileSize: 0,//单位为kb，如果为0表示不限制文件大小
                //minFileCount: 0,
                maxFileCount: 9, //表示允许同时上传的最大文件个数
                enctype: 'multipart/form-data',
                validateInitialCount:true,
                previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
                msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}！",
            }).on('filepreupload', function(event, data, previewId, index) {     //上传中
                //console.log('文件正在上传');
            }).on("fileuploaded", function (event, data, previewId, index) {    //一个文件上传成功
                var form = data.form, files = data.files, extra = data.extra,
                    response = data.response, reader = data.reader;
                //console.log(response);//打印出返回的json
                //console.log(response.status);//打印出路径
            }).on('fileerror', function(event, data, msg) {  //一个文件上传失败
                //console.log('文件上传失败！'+data.status);
            }).on("filebatchselected", function(event, files) {
                //console.log('选择文件后:::::')
                //console.log(files)
                if (($('.form-control-file').find('.file-preview-frame').length) * 0.5 > 9) {
                    showFormText('#words-error', '图片最多为9张');
                }
            });
        }
        $('#submit').click(function ()
        {
            $('#uploadForm').submit;
        })

    </script>
</body>
</html>